<template>
	<view>
		<view class="bg">
		</view>
		<view class="bg_pay" v-show="isShow" @click="closeToast">
		</view>
		<view class="wrapper">
			<view class="middle borderB">
				<view>
					充值金额（元）
				</view>
				<view class="input">
					<view class="label">
						¥
					</view>
					<view class="data">
						<u-input type="digit" v-model="money" placeholder="请输入充值金额" :disabled="isShow"/>
					</view>
				</view>
			</view>
			<view class="middle">
				<view class="middle_wrapper">
					<view class="image">
						<image src="../../../../static/image/tishi-4@2x(1).png" mode=""></image>
					</view>
					<view class="content">
						微信支付充值直接到账，其余转账支付需等待客服审核 后才会到账~
					</view>
				</view>
			</view>
		</view>
		<view class="btn" @click="sureRecharge">
			<button>确定充值</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				money:"",
			}
		},
		methods: {
			KeyboarOpen(e) {
			    this.$refs.KeyboarHid.open();
			},
			onInput(val) {
				this.password = val;
			},
			async confirm(value){
				console.log(value)
				
			},
			async recharge(money){
				let token=uni.getStorageSync("token")
				const {data}=await this.$http({
					url:"member/czyue",
					header:{
						token
					},
					data:{
						money
					}
				})
				return data
			},
			async sureRecharge(){
				if(this.money.length==0){
					return
				}
				const res=await this.recharge(this.money)
				if(res.code!==1){
					uni.showToast({
						title:res.msg,
						icon:"error"
					})
					return
				}
				let {data}=res;
				uni.requestPayment({
					timeStamp:data.timeStamp,
					nonceStr:data.nonceStr,
					package:data.package,
					signType:data.signType,
					paySign:data.paySign,
					success:async ()=>{
						uni.showToast({
							title:"充值成功",
						})
						await this.getUserInfo()
						setTimeout(()=>{
							uni.redirectTo({
								url:"/pages/mime/children/myWallet/myWallet"
							})
						},1000)
					},
					fail(){
						uni.showToast({
							title:"充值失败，请重试",
							icon:"none"
						})
					}
				})
				
			},
			async getUserInfo(){
				let token=uni.getStorageSync("token");
				const {data}=await this.$http({
					url:"member/info",
					header:{
						token
					}
				})
				uni.setStorageSync("userInfo",data.data)
			}
		}
	}
</script>

<style scoped>
.bg{
	width: 100%;
	height: 100%;
	background-color: #F1F1F1;
	position: fixed;
	left: 0;
	top: 0;
	z-index: -1;
}
.wrapper{
	padding: 30rpx;
}
.middle{
	background-color: #FFFFFF;
	padding: 30rpx;
}
.middle{
	font-size: 26rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #333333;
}
.middle .input{
	display: flex;
	align-items: center;
	margin-top: 20rpx;
}
.middle .input .label{
	font-size: 60rpx;
	font-family: PingFang SC;
	font-weight: 600;
	color: #333333;
}
.middle .data{
	margin-left: 20rpx;
}
.borderB{
	border-bottom: 1px solid rgba(151,151,151,0.2);
}
.middle_wrapper{
	display: flex;
}
.middle_wrapper .image image{
	width: 30rpx;
	height: 30rpx;
	vertical-align: bottom;
}
.content{
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #999999;
	margin-left: 10rpx;
}
.btn button{
	width: 690rpx;
	height: 80rpx;
	background: #F7CC46;	
	border-radius: 40rpx;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #FDFBFB;
}
.toast{
	background-color: #FFFFFF;
	height: 381rpx;
	width: 520rpx;
	position: fixed;
	left: 50%;
	top: 35%;
	transform: translate(-50%,-50%);
	text-align: center;
	border-radius: 20rpx;
	z-index: 99;
}
.text1{
	margin-top: 70rpx;
	font-size: 36rpx;
	font-family: PingFang SC;
	font-weight: 600;
	color: #333333;
}
.suremoney{
	margin: 30rpx;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #333333;
}
 .main {
    padding: 0rpx 40rpx;
  }
  .ipt {
    border-bottom: 1rpx solid #CCCCCC;
  }
  .item {
    padding: 10rpx 0rpx;
  }
  .title {
    margin: 30rpx 0;
  }
  .bg_pay{
	  position: fixed;
	  left: 0;
	  bottom: 0;
	  width: 100%;
	  height: 100%;
	  background: #000000;
	  opacity: 0.5;
	  z-index: 1;
  }
  .close{
	  position: absolute;
	  left:5%;
	  top: 7%;
  }
  .close image{
	  width: 30rpx;
	  height: 30rpx;
  }
</style>
